
import styles from './styles.module.scss'
import NewsIcon from '@/assets/news.png'
import NewsBlock from '@/components/NewsBlock'
import Videos from '@/assets/videos.png'
import HotScore from '../HotScore'
import Live from '../Live'
import Head from 'next/head'
import RenderJudge from '../RenderJudge'
import LiveH5 from '@/components/H5/Home/Live'
import { useLiveListHeight } from '@/common/tool'
const LeagueMatch = ({ smileVideo, newsList, matchType, hotMatch, liveListData, mobile }) => {
  console.log(liveListData)
  const type = {
    [process.env.NEXT_PUBLIC_Football]: "足球",
    [process.env.NEXT_PUBLIC_Basketball]: '篮球',
  }
  const text = {
    [process.env.NEXT_PUBLIC_Basketball]: {
      t: "篮球直播_篮球比赛直播_篮球直播在线观看-鑫球体育",
      d: `鑫球体育网-篮球直播涵盖全球篮球赛事直播,提供最新无插件高清免费的篮球视频直播信号。免费篮球直播哪里看？就上鑫球体育-篮球直播吧！`,
      k: "篮球直播,篮球比赛直播,篮球直播在线观看,免费篮球直播,鑫球体育网"
    },
    [process.env.NEXT_PUBLIC_Football]: {
      t: "足球直播_足球比赛直播_足球直播在线观看-鑫球体育",
      d: "鑫球体育网-足球直播涵盖全球足球赛事直播,提供最新无插件高清免费的足球视频直播信号。免费足球直播哪里看？就上鑫球体育-足球直播吧！",
      k: "足球直播,足球比赛直播,足球直播在线观看,免费足球直播,鑫球体育网"
    }
  }
  const { leftRef, rightRef, liveHeight } = useLiveListHeight(40)
  return (
    <>
      <Head>
        <title>{Reflect.get(text, matchType)?.t}</title>
        <meta name='description' content={Reflect.get(text, matchType)?.d} />
        <meta name="keywords" content={Reflect.get(text, matchType)?.k} />
      </Head>
      <RenderJudge value={mobile} active={
        <LiveH5 liveListData={liveListData} match={{ type: matchType }}></LiveH5>
      } inactive={
        <main className={styles.home}>
          <section className={styles.left}>
            <div ref={leftRef}>
              <Live.Title type={matchType} text={type[matchType] + "直播"} />
            </div>
            <Live container={{ height: liveHeight }} liveListData={liveListData} match={{ type: matchType, id: "" }}></Live>
          </section>
          <section className={styles.right} ref={rightRef}>
            <HotScore hotMatch={hotMatch}></HotScore>
            <>
              <NewsBlock link={row => `/news/${row?.id}`} img={NewsIcon} text={type[matchType] + '资讯'} hasRight data={newsList} ></NewsBlock>
              <NewsBlock link={(row) => `/marvellous/${row?.id}`} img={Videos} text={type[matchType] + '集锦'} hasRight data={smileVideo} ></NewsBlock>
            </>
          </section>
        </main>
      } />
    </>
  )
}


export default LeagueMatch